<script setup lang="ts">
import useAppStore from '../../../../store/modules/app';
import { navigate } from '@/utils/navigate';

type EmitEvents = {
  (event: 'seach', payload: { value: string }): void;
};
const emits = defineEmits<EmitEvents>();
const store = useAppStore();
</script>
<script lang="ts">
export default {
  options: { styleIsolation: 'shared' },
};
</script>

<template>
  <view class="c-bg" :style="{ paddingTop: `${store.$state.menuInfo.top}px`, height: store.$state.menuInfo.height + 8 + 'px', paddingRight: store.$state.menuInfo.width + 12 + 'px' }">
    <view class="w-full flex items-center justify-between" :style="{ height: 'calc(100% - 8px)' }">
      <i class="i-mingcute:left-fill text-[28px]" @click="navigate({ type: 'navigateBack', url: '' })" />
      <view class="flex-1 ml-[8px]">
        <van-search shape="round" placeholder="请输入产品关键词" @search="(e: any) => emits('seach', { value: e.detail })" />
      </view>
    </view>
  </view>
</template>

<style scoped lang="scss">
:deep(.van-search) {
  padding: 0 !important;
  background: transparent !important;
}
</style>
